<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <!--引入的css-->
    <link rel="stylesheet" href="dist/bootstrap-3.3.5-dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="dist/bootstrap-3.3.5-dist/css/bootstrap-theme.min.css">
    <link rel="stylesheet" href="dist/css/normalize.css">
    <link rel="stylesheet" href="dist/css/default.css">
    <!--自己写的css-->
    <link rel="stylesheet" href="src/css/layout.css">
    <!--引入的js库-->
    <script src="dist/js/jquery-1.11.3.min.js"></script>
    <script src="dist/bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>
    <script src="dist/js/prefixfree.min.js"></script>
    <script src="dist/js/stopExecutionOnTimeout.js"></script>

    <!--自己写的js-->
    <script src="src/js/init.js"></script>
</head>
<body>
    <div class="page-header">
        <h1>SE小队装逼系统 <small>装逼改变世界</small></h1>
    </div>
    <div>
        <ul class="nav nav-tabs">
            <li role="presentation" class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
                    hxb <span class="caret"></span>
                </a>
                <ul class="dropdown-menu">
                    <li><a href="#bs-display" data-toggle="tab">test</a></li>
                    <li><a href="#bs-display1" data-toggle="tab">test1</a></li>
                </ul>
            </li>
            <li role="presentation" class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
                    zhq <span class="caret"></span>
                </a>
                <ul class="dropdown-menu">
                    <li><a href="#ano-display" data-toggle="tab">测试</a></li>
                    <li><a href="#ano-display1" data-toggle="tab">测试1</a></li>
                </ul>
            </li>
            <li role="presentation" class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
                    come soon <span class="caret"></span>
                </a>
            </li>
        </ul>
    </div>
    <div  id="ourTabContent" class="tab-content">
        <div class="tab-pane" id="bs-display">
            <div class="stars">

            </div>
            <script>
                $(document).ready(function () {
                    var stars = 800;
                    var $stars = $('.stars');
                    var r = 800;
                    for (var i = 0; i < stars; i++) {
                        if (window.CP.shouldStopExecution(1)) {
                            break;
                        }
                        var $star = $('<div/>').addClass('star');
                        $stars.append($star);
                    }
                    window.CP.exitedLoop(1);
                    $('.star').each(function () {
                        var cur = $(this);
                        var s = 0.2 + Math.random() * 1;
                        var curR = r + Math.random() * 300;
                        cur.css({
                            transformOrigin: '0 0 ' + curR + 'px',
                            transform: ' translate3d(0,0,-' + curR + 'px) rotateY(' + Math.random() * 360 + 'deg) rotateX(' + Math.random() * -50 + 'deg) scale(' + s + ',' + s + ')'
                        });
                    });
                });
            </script>
        </div>
        <div class="tab-pane" id="bs-display1">
            <p>asdadasdasdasdas</p>
        </div>
        <div class="tab-pane" id="ano-display">
            <p>11111</p>
        </div>
        <div class="tab-pane" id="ano-display1">
            <p>cecece</p>
        </div>
    </div>
</body>
</html>